<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>商城首页</title>
		<link rel="stylesheet" type="text/css" href="css/index.css" />
		<link rel="stylesheet" type="text/css" href="font/iconfont.css" />
		<link rel="shortcut icon" type="image/x-icon" href="img/icon.png" />
		<link rel="stylesheet" type="text/css" href="css/swiper-bundle.min.css" />
		<script src="js/axios.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/api.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/index.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<div id="wrap">
			<div class="top">教育优惠 | Surface 主机9折起，高校师生认证购机享优惠。立即购买></div>
			<nav id="nav">
				<img src="img/microsoft.png">
				<ul id="nav-side">
					<li><a href="#">微软商城</a></li>
					<li>
						<a href="#">硬件</a>
						<ul class="erji">
							<li>Surface</li>
							<li>认证翻新</li>
							<li>Xbox</li>
							<li>混合实现</li>
							<li>配件</li>
						</ul>
						<span>&lt;</span>
					</li>
					<li>
						<a href="#">软件</a>
						<span>&lt;</span>
						<ul class="subnav">
							<li>Microsoft 365</li>
							<li>Office 2019</li>
							<li>Windows</li>
							<li>Apps与Windows 10游戏</li>
							<li>Visual Studio</li>
							<li>Microsoft Complete and Plus</li>
							<li>其他软件与服务</li>
						</ul>
					</li>
					<li><a href="#">企业购</a></li>
					<li><a href="#">教育</a></li>
					<li><a href="#">以旧换新</a></li>
					<li><a href="#">活动优惠</a></li>
					<li><a href="#">商城承诺</a></li>
					<li><a href="#">支持与帮助</a></li>
				</ul>
				<div id="nav-right">
					<div class="search">搜索
						<span class="iconfont icon-sousuo"></span>
						<div class="ipt"><input type="text">取消</div>
					</div>
					<a href="shop.html">
						<div class="shop iconfont icon-che"></div>
					</a>
					<div id="login">
						登录
						<span class="iconfont icon-user-1"></span>
						<div id="login-nav">
							<img src="img/microsoft.png">
							<ul class="login-list">
								<li>我的账户</li>
								<li>我的订单</li>
								<li>地址管理</li>
								<li>我的专区</li>
								<li>我的优惠券</li>
							</ul>
							<a href="login.html"><button type="button">登录</button></a>
						</div>
					</div>
				</div>
			</nav>
			<div class="swiper1 ">
				<div class="swiper-container lunb1">
					<div class="swiper-wrapper">
						<div class="swiper-slide"><img src="img/banner1.png" /></div>
						<div class="swiper-slide"><img src="img/banner2.png" /></div>
						<div class="swiper-slide"><img src="img/banner3.png" /></div>
					</div>
					<!-- 如果需要分页器 -->
					<div class="swiper-pagination"></div>
					<!-- 如果需要导航按钮 -->
					<div class="swiper-button-prev"></div>
					<div class="swiper-button-next"></div>
				</div>
			</div>
			<div id="main">
				<div class="sever-top">
					<ul class="service">
						<li><i class="iconfont icon-suitcase"></i>企业购</li>
						<li><i class="iconfont icon-bijiben1"></i>Surface</li>
						<li><i class="iconfont icon-bijiben"></i>认证翻新Surface</li>
						<li><i class="iconfont icon-weiruan-fill-color"></i>Microsoft 365</li>
						<li><i class="iconfont icon-xbox"></i>Xbox+游戏</li>
						<li><i class="iconfont icon-weiruan-fill-color"></i>Windows</li>
						<li><i class="iconfont icon-vr"></i>混合现实</li>
						<li><i class="iconfont icon-woshou"></i>商城承诺</li>
					</ul>
				</div>
				<div id="content">
					<div class="content1">
					<!-- 	<dl>
							<dt><img src="img/content1-service1.png"></dt>
							<dd>
								<span>新品</span>
								<p>Surface Laptop 4 All Access 套餐，13.5英寸酷睿 i5 16GB 512GB 月供473.58元起</p>
								<a href="#">立即购买&lt;</a>
							</dd>
						</dl>
						<dl>
							<dt><img src="img/content1-service2.png"></dt>
							<dd>
								<span>配件8折</span>
								<p>Surface Pro 7 酷睿 i5 8GB 256GB 优选套餐，享精选配件8折加购优惠</p>
								<a href="#">立即购买&lt;</a>
							</dd>
						</dl>
						<dl>
							<dt><img src="img/content1-service3.png"></dt>
							<dd>
								<span>配件8折</span>
								<p>Surface Book 3 All Access 套餐，15英寸酷睿 i7 32GB 1TB 月供965.25元起</p>
								<a href="#">立即购买&lt;</a>
							</dd>
						</dl>
						<dl>
							<dt><img src="img/content1-service4.png"></dt>
							<dd>
								<span>配件8折</span>
								<p>Surface Go 2 酷睿 m3 8GB 128GB WiFi 版，单机及优选套餐享精选配件8折加购优惠</p>
								<a href="#">立即购买&lt;</a>
							</dd>
						</dl> -->
					</div>
					<div class="content2">
						<h1>店长推荐</h1>
						<div class="column1">
						<!-- 	<dl>
								<dt><img src="img/content2-service1.png"></dt>
								<dd>
									<span class="dz">配件8折</span>
									<div class="js">
										<h2>Surface Laptop 3</h2>
										13.5英寸酷睿 i5 8GB 256GB，单机及优选套餐享配件8折
									</div>
									<div class="column1-font">
										<span>售价：<i>￥ 9,728.00 起</i></span>
										<a href="#">立即购买&lt;</a>
									</div>
								</dd>
							</dl>
							<dl>
								<dt><img src="img/content2-service2.png"></dt>
								<dd>
									<span class="dz">配件8折</span>
									<div class="js">
										<h2>Surface Laptop Go</h2>
										酷睿 i5 8GB 128GB，单机及优选套餐享配件8折
									</div>
									<div class="column1-font">
										<span>售价：<i>￥ 5,488.00 起</i></span>
										<a href="#">立即购买&lt;</a>
									</div>
								</dd>
							</dl>
							<dl>
								<dt><img src="img/content2-service3.png"></dt>
								<dd>
									<span class="dz">配件8折</span>
									<div class="js">
										<h2>Surface Pro X</h2>
										Microsoft SQ 2 16GB 512GB，单机及优选套餐享配件8折
									</div>
									<div class="column1-font">
										<span>售价：<i> ￥ 14,188.00 起</i></span>
										<a href="#">立即购买&lt;</a>
									</div>
								</dd>
							</dl>
							<dl>
								<dt><img src="img/content2-service4.png"></dt>
								<dd>
									<span class="dz">配件8折</span>
									<div class="js">
										<h2>认证翻新 Surface Laptop Go</h2>
										酷睿 i5 8GB 128GB 冰晶蓝
									</div>
									<div class="column1-font">
										<span>售价：<i>￥ 4,199.00 起</i></span>
										<a href="#">立即购买&lt;</a>
									</div>
								</dd>
							</dl>
							<dl>
								<dt><img src="img/content2-service5.png"></dt>
								<dd>
									<span class="dz">配件8折</span>
									<div class="js">
										<h2>认证翻新 Surface Laptop Go</h2>
										酷睿 i5 8GB 128GB 亮铂金
									</div>
									<div class="column1-font">
										<span>售价：<i>￥ 4,199.00 起</i></span>
										<a href="#">立即购买&lt;</a>
									</div>
								</dd>
							</dl>
							<dl>
								<dt><img src="img/content2-service6.png"></dt>
								<dd>
									<span class="dz">配件8折</span>
									<div class="js">
										<h2>全新 Xbox Series X</h2>
										新世代主机效能，展现优异游戏体验
									</div>
									<div class="column1-font">
										<span>售价：<i> ￥ 3,899.00起</i></span>
										<a href="#">立即购买&lt;</a>
									</div>
								</dd>
							</dl> -->
						</div>
					</div>
					<div class="content3">
						<h1>Surface</h1>
						<div class="column2">
							<div class="column2-content">
								<div class="column2-service">
									<div class="column2-service-img"><img src="img/content3-service1.png"></div>
									<p>卓越生产力，非凡创造力</p>
									<a href="#">了解详情</a>
								</div>
								<dl>
									<dt><img src="img/content3-service2.png"></dt>
									<dd>
										<div class="column2-top">
											<div class="newshop"><span>新品</span></div>
											<h2>全新 Surface Laptop 4</h2>
											<p>外观、性能、速度，面面出众，现可选全新颜色冰晶蓝</p>
										</div>
										<div class="column2-font">
											<p>售价：￥ 7,888.00 起</p>
											<a href="#">立即购买&lt;</a>
										</div>
									</dd>
								</dl>
								<dl>
									<dt><img src="img/content3-service3.png"></dt>
									<dd>
										<div class="column2-top">
											<div class="newshop"></div>
											<h2>Surface Pro X</h2>
											<p>Microsoft SQ 2 16GB 512GB 键盘盖套餐</p>
										</div>
										<div class="column2-font">
											<p>售价： ￥ 15,138.00 起</p>
											<a href="#">立即购买&lt;</a>
										</div>
									</dd>
								</dl>
								<dl>
									<dt><img src="img/content3-service4.png"></dt>
									<dd>
										<div class="column2-top">
											<div class="newshop"></div>
											<h2>Surface Studio 2</h2>
											<p>你的创意工作室</p>
										</div>
										<div class="column2-font">
											<p>售价： ￥ 29,108.00 起</p>
											<a href="#">立即购买&lt;</a>
										</div>
									</dd>
								</dl>
							</div>
						</div>
					</div>
					<div class="content3">
						<h1>Office</h1>
						<div class="column2">
							<div class="column2-content">
								<div class="column2-service">
									<div class="column2-service-img"><img src="img/content4-service1.png"></div>
									<p>Microsoft 365，成就工作生活家</p>
									<a href="#">了解详情</a>
								</div>
								<dl>
									<dt><img src="img/content4-service2.png"></dt>
									<dd>
										<div class="column2-top">
											<div class="newshop"><span>6人使用</span></div>
											<h2>Microsoft 365 家庭版</h2>
											<p>可供多达6人共享，订阅期内享持续更新</p>
										</div>
										<div class="column2-font">
											<p>售价： ￥ 498.00</p>
											<a href="#">立即购买&lt;</a>
										</div>
									</dd>
								</dl>
								<dl>
									<dt><img src="img/content4-service2.png"></dt>
									<dd>
										<div class="column2-top">
											<div class="newshop"><span>1人在使用</span></div>
											<h2>Microsoft 365 个人版</h2>
											<p>可在所有设备安装，订阅期内享持续更新</p>
										</div>
										<div class="column2-font">
											<p>售价： ￥ 398.00</p>
											<a href="#">立即购买&lt;</a>
										</div>
									</dd>
								</dl>
								<dl>
									<dt><img src="img/content4-service3.png"></dt>
									<dd>
										<div class="column2-top">
											<div class="newshop"></div>
											<h2>Office 家庭和学生版 2019</h2>
											<p>2019 版经典应用，一次购买，永久使用</p>
										</div>
										<div class="column2-font">
											<p>售价： ￥ 748.00</p>
											<a href="#">立即购买&lt;</a>
										</div>
									</dd>
								</dl>
							</div>
						</div>
					</div>
					<div class="content3">
						<h1>Xbox</h1>
						<div class="column2">
							<div class="column2-content">
								<div class="column2-service">
									<div class="column2-service-img"><img src="img/content5-service1.png"></div>
									<p>劲畅游戏体验，一触即发</p>
									<a href="#">了解详情</a>
								</div>
								<dl>
									<dt><img src="img/content5-service2.png"></dt>
									<dd>
										<div class="column2-top">
											<div class="newshop"><span>新品</span></div>
											<h2>全新 Xbox Series X</h2>
											<p>新世代主机效能，展现优异游戏体验</p>
										</div>
										<div class="column2-font">
											<p>售价： ￥ 3,899.00</p>
											<a href="#">立即购买&lt;</a>
										</div>
									</dd>
								</dl>
								<dl>
									<dt><img src="img/content5-service3.png"></dt>
									<dd>
										<div class="column2-top">
											<div class="newshop"><span>新品</span></div>
											<h2>全新 Xbox Series S</h2>
											<p>精巧小身材，畅玩新世代</p>
										</div>
										<div class="column2-font">
											<p>售价： ￥ 2,399.00</p>
											<a href="#">立即购买&lt;</a>
										</div>
									</dd>
								</dl>
								<dl>
									<dt><img src="img/content5-service4.png"></dt>
									<dd>
										<div class="column2-top">
											<div class="newshop"><span>新品</span></div>
											<h2>Xbox 无线控制器</h2>
											<p>破晓行动特别款，劲畅游戏体验</p>
										</div>
										<div class="column2-font">
											<p>售价： ￥ 499.00</p>
											<a href="#">立即购买&lt;</a>
										</div>
									</dd>
								</dl>
							</div>
						</div>
					</div>
					<div class="content3">
						<h1>配件</h1>
						<div class="column2">
							<div class="column2-content">
								<div class="column2-service">
									<div class="column2-service-img"><img src="img/content6-service1.png"></div>
									<p>激发设备潜能，畅享品质生活</p>
									<a href="#">了解详情</a>
								</div>
								<dl>
									<dt><img src="img/content6-service2.png"></dt>
									<dd>
										<div class="column2-top">
											<div class="newshop"><span>新品</span></div>
											<h2>微软设计师键盘</h2>
											<p>紧凑设计，纤薄便携，蓝牙5.0连接，可配对多达3台设备</p>
										</div>
										<div class="column2-font">
											<p>售价： ￥ 559.00</p>
											<a href="#">立即购买&lt;</a>
										</div>
									</dd>
								</dl>
								<dl>
									<dt><img src="img/content6-service3.png"></dt>
									<dd>
										<div class="column2-top">
											<div class="newshop"></div>
											<h2>微软 USB Type-C 扩展坞</h2>
											<p>五种接口，即插即用，小巧便携，移动办公更轻松</p>
										</div>
										<div class="column2-font">
											<p>售价： ￥ 889.00</p>
											<a href="#">立即购买&lt;</a>
										</div>
									</dd>
								</dl>
								<dl>
									<dt><img src="img/content6-service4.png"></dt>
									<dd>
										<div class="column2-top">
											<div class="newshop"><span>新品</span></div>
											<h2>微软精巧鼠标迷彩特制版</h2>
											<p>全新迷彩风格设计，小巧便携，蓝牙5.0稳定畅连</p>
										</div>
										<div class="column2-font">
											<p>售价： ￥ 179.00</p>
											<a href="#">立即购买&lt;</a>
										</div>
									</dd>
								</dl>
							</div>
						</div>
					</div>
					<div class="content6">
						<h1>游戏</h1>
						<div id="column3-content">
							<!-- 游戏这路有问题-->
							<div class="swiper-container lunb2">
								<div class="swiper-wrapper">
									<div class="swiper-slide"><img src="img/content7-service1.png"></div>
									<div class="swiper-slide"><img src="img/content7-service2.png"></div>
									<div class="swiper-slide"><img src="img/content7-service3.png"></div>
									<div class="swiper-slide"><img src="img/content7-service4.png"></div>
									<div class="swiper-slide"><img src="img/content7-service5.png"></div>
									<div class="swiper-slide"><img src="img/content7-service6%20.png"></div>
									<div class="swiper-slide"><img src="img/content7-service7%20.png"></div>
									<div class="swiper-slide"><img src="img/content7-service8.png"></div>

								</div>

								<div class="swiper-button-prev"></div>
								<div class="swiper-button-next"></div>
							</div>
						</div>
					</div>
					<div class="content8">
						<h1>商城承诺</h1>
						<div class="column8-content">
							<ul>
								<li><i class="iconfont icon-tuihuo"></i>30天退换货</li>
								<li><i class="iconfont icon-rili"></i>30天嘉宝</li>
								<li><i class="iconfont icon-shunfengshangmen"></i>顺丰包邮</li>
								<li><i class="iconfont icon-kefu"></i>24X7在线服务</li>
								<li><i class="iconfont icon-bijiben1"></i>认证翻新 Surface</li>
								<li><i class="iconfont icon-yinhangqiazhifuzhangdanfukuanjinqianchucunqia"></i>微信/支付宝
									快捷支付</li>
								<li><i class="iconfont icon-yijiuhuanxin"></i>超万种产品 以旧换新</li>
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div id="font">
			<div class="font-content">
				<div class="font-top">
					<span>获取新品发售资讯，有机会享专属优惠</span>
					<input type="text" placeholder="请输入您的邮箱地址" />
					<button type="button" class="btn">订阅</button>
					<a href="#">隐私条款</a>
				</div>
				<div id="font-text">
					<div id="product">
						<h1>产品介绍</h1>
						<ul>
							<li>Surface</li>
							<li>Microsoft 365</li>
							<li>Xbox</li>
							<li>Office</li>
							<li>Windows</li>
							<li>Visual Studio</li>
							<li>混合现实</li>
							<li>其他软件与服务</li>
							<li>配件</li>
						</ul>
						<p>其他微软站点</p>
					</div>
					<div class="account">
						<h1>账户信息</h1>
						<ul>
							<li>账户信息</li>
							<li>订单跟踪</li>
							<li>订单历史</li>
							<li>软件密钥和下载</li>
						</ul>
					</div>
					<div class="direction">
						<h1>支持与帮助</h1>
						<ul>
							<li>产品支持信息</li>
							<li>退换货政策</li>
							<li>常见问题</li>
							<li>软件产品问题</li>
							<li>教育优惠相关问题</li>
							<li>购物流程</li>
							<li>支付与配送</li>
							<li>售后服务</li>
						</ul>
					</div>
					<div class="hot">
						<h1>人们资源</h1>
						<ul>
							<li>Surface Laptop Go</li>
							<li>Surface Pro X</li>
							<li>Surface Book 3</li>
							<li>Surface Go 2</li>
							<li>Surface Pro 7</li>
							<li>Surface Pro 7+</li>
							<li>Surface Laptop 4</li>
							<li>Surface Studio 2</li>
							<li>Xbox One</li>
							<li>Microsoft 365</li>
							<li>Office for Mac</li>
							<li>优惠信息</li>
							<li>教育专区</li>
							<li>以旧换新</li>
							<li>商务专区</li>
						</ul>
					</div>
					<div class="about">
						<h1>关于我们</h1>
						<ul>
							<li>查找店铺</li>
							<li>网站地图</li>
							<li>微软店中店</li>
							<li>商城承诺</li>
						</ul>
					</div>
					<div class="pay">
						<h1>关于我们</h1>
						<ul>
							<li>官方微博</li>
							<li class="iconfont icon-_weibo"></li>
							<li>微软官方商城</li>
							<li>微信公众号</li>
							<li><img src="img/weixin.png"></li>
						</ul>
					</div>
				</div>
				<div class="font-bottom">
					<span><i class="iconfont icon-diqiu"></i>中国 - 简体中文</span>
					<p>使用与销售隐私权声明商标沪ICP备12038052号-4<img src="img/font-icon1.png">京公网安备11010802023178号公司证件◎2020 Microsoft
					</p>
				</div>
			</div>
		</div>
	</body>

	<script src="js/swiper-bundle.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/lunbo.js" type="text/javascript" charset="utf-8"></script>
</html>
